Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added wrapping object for every type-declared record used as a prop object with [<ReactComponentAttribute>] #606

Draft
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

lukaszkrzywizna
Copy link
Contributor

It resolves #603

@lukaszkrzywizna lukaszkrzywizna force-pushed the react-component-record-wrapping branch from 8056457 to bacf81d Compare May 23, 2024 06:44
// JSX <Component props={ { Value={1} } } />
// JS createElement(Component, { props = { Value: 1 } })

// anonymous record
// F# Component { Value = 1 }
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For clarity we could perhaps use the anonymous syntax ?

// F# Component {| Value = 1 |}

@Zaid-Ajaj
Copy link
Owner

Hi @lukaszkrzywizna I know it's been a while since we implemented the record wrapping in its current state. I can't seem to remember why exactly it was needed 🤔 maybe for cases where React was re-rendering things because the record got a new reference but the data hasn't changed.

Personally I feel like we shouldn't change anything here. It's hard to maintain F#-ness of things when going into React world. Keep things simple and when you need F#-ness maintained, use anonymous record to wrap things. Also before adding something like this, we would need to revive the unit test suite to ensure we are not breaking anyone with these changes 😅

- Added support for records with a lowercased 'key' property.
- Added warning for anonymous records used as props-object with a lowercased 'key' property.
@lukaszkrzywizna
Copy link
Contributor Author

lukaszkrzywizna commented Jun 7, 2024

Thank you @Zaid-Ajaj for the response!

React was re-rendering things because the record got a new reference but the data hasn't changed.

Hmm... I don't recognize any mechanism similar to this. Maybe React.memo? But according to documentation it compares props one-by-one, not the whole props object.

Personally I feel like we shouldn't change anything here.

I would agree, but tracking down the issue in my production app cost me many hours. The record passed as an argument was used in a dispatch message where the handler retrieved it and checked if the map contained it. The entire record prototype was erased, so it couldn't work properly, causing the problem to manifest far away from the actual cause in the app. Any information from the compiler would be a huge help in the future, but I understand that changing the behavior of record construction could be significant. That's why I propose at least showing a warning.

we would need to revive the unit test suite to ensure we are not breaking anyone with these changes

Do you mean the 'Tests' project? I can try to revive this. Do you know what should be done?

Besides that, I have been using a forked version with the fix in production for two weeks, and so far, no errors. 😅

@Zaid-Ajaj
Copy link
Owner

Do you mean the 'Tests' project? I can try to revive this. Do you know what should be done?

Yeah that's the one. mostly going for github actions instead of appveyor, updating deps etc.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Enhance Handling of F# Record Types as Props in ReactComponent Attribute
3 participants